<template>
	<view class="user-wrap">
		<view class="main-bg">
			<view class="topNav" :style="{height:state.navHeight+'px',paddingTop:state.statusBarHeight+'px'}">
				<view class="main-info">
					<view class="main-user">
						<view class="avatar-box" @click="handleAvatarClick">
							<image :src="isLogin && state.userInfo.avatar ? state.userInfo.avatar : state.avatart"
								mode="scaleToFill" class="tui-avatar"></image>
						</view>
						<view class="avatar-info">
							<view class="user-flex">
								<view class="user-name" :data-logged-in="isLogin ? 'true' : 'false'"
									@click="handleLoginClick">
									{{isLogin && state.userInfo.nickname ? state.userInfo.nickname : '请登录'}}</view>
								<!-- 登录时显示VIP等级 -->
								<image v-if="isLogin"
									:src="state.vipLevel==0?state.registeVip:state.vipLevel==1?state.preferentialVip:state.gongfuVip"
									mode="aspectFill" class="vip-img"></image>
							</view>
							<!-- 登录时显示邀请码 -->
							<view class="invitation-code">
								邀请码: <text v-if="state.isOpenEyes">{{state.invitationCode}}</text>
								<text v-else>******</text>
								<view class="copy-box" @click="handleCopyWithLogin">复制</view>
								<view class="glasses-box" @click="handleOpenEyesWithLogin">
									<image mode="widthFix" :src="state.isOpenEyes?state.openEyes:state.eyesClosed"
										class="eys-box">
									</image>
								</view>
							</view>
						</view>
					</view>
					<view class="main-right">
						<view class="refresh-box" @click="handleRefresh">
							<image :src="state.refreshImg" mode="widthFix" class="img-info"></image>
						</view>
						<view class="customerService-box" @click="handleCustomerServiceDirect">
							<image :src="state.customerService" mode="widthFix" class="img-info"></image>
						</view>
						<view class="userInfo-box" @click="handleInfoWithLogin">
							<image :src="state.userInfoImg" mode="widthFix" class="img-info"></image>
							<view class="unread-badge" v-if="state.count > 0">
								<text>{{ state.count > 99 ? '99+' : state.count }}</text>
							</view>
						</view>
					</view>
				</view>
			</view>
		</view>
		<!-- 我的微豆 - 未登录用户也可看到，但操作需要登录，工富会员隐藏 -->
		<view v-if="!(isLogin && state.vipLevel == 2)" class="my-tiny-beans" @click="handleMicroBeansWithLogin">
			<view class="my-name">我的微豆</view>
			<view class="num-box">
				{{isLogin ? (state.userInfo.microbean || 0) : '0'}}
				<image :src="state.myarrow" mode="widthFix" class="arrowRight-img"></image>
			</view>
		</view>
		<!-- 共富会员内容 -->
		<view v-if="isLogin && state.vipLevel==2">
			<view class="card-list-wrap">
				<view class="card-item">
					<view class="eyes-box" @click="handlewWalletBalanceFlagWithLogin">
						<image mode="widthFix" :src="state.walletBalanceFlag?state.openEyes:state.eyesClosed"
							class="eys-box"></image>
					</view>
					<view class="money-box" @click="goMywalletWithLogin">
						<view v-if="!isLogin">******</view>
						<view v-else-if="state.walletBalanceFlag">{{state.userInfo.money}}</view>
						<view v-else>******</view>
					</view>
					<view class="tips-box">钱包余额</view>
					<view class="card-btn" @click="goMywalletWithLogin">去提现</view>
				</view>
				<view class="card-item">
					<view class="eyes-box" @click="handleWeidouAccountWithLogin">
						<image mode="widthFix" :src="state.weidouAccount?state.openEyes:state.eyesClosed"
							class="eys-box"></image>
					</view>
					<view class="money-box" @click="handleMicroBeansWithLogin">
						<view v-if="!isLogin">******</view>
						<view v-else-if="state.weidouAccount">{{state.userInfo.microbean || 0}}</view>
						<view v-else>******</view>
					</view>
					<view class="tips-box">微豆账户</view>
					<view class="card-btn" @click="handleMicroBeansWithLogin">进入账户</view>
				</view>
				<view class="card-item">
					<view class="eyes-box" @click="handleConsumptionBalanceFlagWithLogin">
						<image mode="widthFix" :src="state.consumptionBalanceFlag?state.openEyes:state.eyesClosed"
							class="eys-box">
						</image>
					</view>
					<view class="money-box" @click="handleConsumptionGoldWithLogin">
						<view v-if="!isLogin">******</view>
						<view v-else-if="state.consumptionBalanceFlag">{{state.userInfo.consumption_credit}}</view>
						<view v-else>******</view>
					</view>
					<view class="tips-box">消费金余额</view>
					<view class="card-btn" @click="handleConsumptionGoldWithLogin">查看明细</view>
				</view>
			</view>
			<view class="income-wrap">
				<view class="income-tips">
					每月25日，结算上月预估共富收益中已完成订单的佣金
				</view>
				<view class="income-list">
					<view class="income-item">
						<view class="income-title">今日预估</view>
						<view class="income-num">{{state.incomeStats.today_income}}</view>
					</view>
					<view class="income-item">
						<view class="income-title">本月预估</view>
						<view class="income-num">{{state.incomeStats.month_income}}</view>
					</view>
					<view class="income-item">
						<view class="income-title">上月预估</view>
						<view class="income-num">{{state.incomeStats.year_income}}</view>
					</view>
					<view class="income-item">
						<view class="income-title">待结算</view>
						<view class="income-num">{{state.incomeStats.yesterday_income}}</view>
					</view>
				</view>
				<view class="flex-list">
					<view class="flex-item" v-for="(el,index) of state.profitList" :key="index"
						@click="handleDetailsWithLogin(el.path)">
						<image class="flex-item-img" :src="el.img" mode="widthFix"></image>
						<view class="text-info">{{el.text}}</view>
					</view>
				</view>
			</view>
			

		</view>
		<!-- 我的订单 - 需要登录 -->
		<view class="my-order">
			<view v-for="(item, index) in template.data" :key="index" :styles="item.style">
				<s-order-card v-if="item.type === 'orderCard'" ref="orderCardRef" :data="item.data" :requireLogin="true" />
			</view>
		</view>
		<!-- 普通会员晋升说明 -->
		<view v-if="(state.vipLevel==0||state.vipLevel==1)" class="card-list">
			<view class="card-wrap" :class="state.vipLevel==0 ? 'register-bg' : 'preferential-bg'">
				<view class="card-title" @click="handleDescribeWithLogin(state.vipLevel)">
					<view>说明</view>
					<view>
						<image :src="state.arrow" mode="widthFix" class="arrow-img-info"></image>
					</view>
				</view>
				<view class="introduction-wrap">
					<view class="introduction-title" v-if="state.vipLevel==0">
						自购满<text class="orgin-color">6件</text>晋升优惠会员
					</view>
					<view class="introduction-title" v-if="state.vipLevel==1">
						直邀<text class="orgin-color">6位</text>会员均达成优惠会员可晋升<text class="orgin-color">共富会员</text>
					</view>
					<view class="item-info">
						{{state.vipLevel==0?'80%以上会员注册日起15日内获得晋升':'80%优惠会员在30日内获得共富权益'}}
					</view>
					<view class="step-wrap">
						<pj-steps ref="stepsRef" :isMicroBean="false" :steps="state.steps" :current="isLogin ? state.current : -1">
						</pj-steps>
					</view>
					<view class="step-tips">
						{{state.vipLevel==0?'已购':'已邀'}} <text class="orgin-color">
							{{isLogin ? (state.vipLevel==0?state.userInfo.repurchase_count || 0:state.userInfo.directs) : 0}}
							{{state.vipLevel==0?'件':'位'}}</text>，{{state.vipLevel==0?'再购':'再邀'}}<text
							class="orgin-color">{{isLogin ? (state.vipLevel==0?(state.steps.length-state.userInfo.repurchase_count || 0):(state.steps.length-state.userInfo.directs || 0)) : state.steps.length}}
							{{state.vipLevel==0?'件':'位'}}</text>{{state.vipLevel==0?'即可获得永久优惠':'即可晋升共富会员'}}
					</view>
				</view>
			</view>
		</view>
		<!-- 共富会员说明 -->
		<view v-if="state.vipLevel==2" class="card-list">
			<view class="card-wrap gongfu-bg">
				<view class="card-title" @click="handleDescribeWithLogin(state.vipLevel)">
					<view>说明</view>
					<view>
						<image :src="state.arrow" mode="widthFix" class="arrow-img-info"></image>
					</view>
				</view>
				<view class="introduction-wrap">
					<view class="introduction-title">
						您已是<text class="orgin-color">共富会员</text>，享受共富收益及育成收益
					</view>
					<view class="item-info">
						共富会员享有最高权益
					</view>
				</view>
			</view>
		</view>
		<!-- 常用功能 - 未登录用户也可看到，但操作需要登录 -->
		<view class="common-functions">
			<view class="title-wrap">常用功能</view>
			<view class="list-wrap">
				<view class="list-item" v-for="(item,index) in filteredListInfo" :key="index"
					@click="handleItemClick(item)">
					<view class="list-icon">
						<image :src="item.icon" mode="aspectFit" class="icon-img"></image>
					</view>
					<view class="list-text">{{item.title}}</view>
				</view>
			</view>
		</view>

		

		<!-- 底部安全间距 -->
		<view class="bottom-safe-area"></view>


		<!-- 平台管家弹框 -->
		<view class="custom-popup-overlay" v-if="state.showPlatformManager" @click="handleClosePopup">
			<view class="custom-popup-content" @click.stop>
				<!-- 背景图 -->
				<view class="dialog-bg-image"></view>
				<!-- 标题 -->
				<view class="dialog-title">平台管家</view>

				<!-- 二维码区域 -->
				<view class="qr-code-section">
					<view class="qr-code-wrapper">
						<image src="https://wemayshiguang.oss-cn-shanghai.aliyuncs.com/qrCode.png" mode="aspectFit"
							class="qr-code-img"></image>
					</view>
				</view>

				<!-- 提示文字 -->
				<view class="instruction-text">
					<text class="scan-text">扫描上方二维码</text>
					<text class="add-text">添加平台管家微信</text>
				</view>

				<!-- 确认按钮 -->
				<view class="confirm-button" @click="handleClosePopup">
					<text class="btn-text">我知道了</text>
				</view>
			</view>
		</view>

		

	</view>
</template>

<script setup>
	import { computed, reactive, ref, nextTick } from 'vue';
	import { onShow, onPageScroll, onPullDownRefresh, onLoad, onHide } from '@dcloudio/uni-app';
	import sheep from '@/sheep';
	import PopupDialog from './components/popupDialog.vue';

	// 定义子组件的ref
	const orderCardRef = ref(null);
	const stepsRef = ref(null);
	const popupDialogRef = ref(null);

	// 获取登录状态
	const isLogin = computed(() => sheep.$store('user').isLogin);

	// 检查登录状态 - 点击操作时检查
	const checkLoginStatus = () => {
		if (!isLogin.value) {
			uni.showModal({
				title: '温馨提示',
				content: '登录个人中心请先登录',
				confirmText: '去登录',
				cancelText: '取消',
				success: (res) => {
					if (res.confirm) {
						uni.navigateTo({
							url: '/subPackages/login/login'
						})
					} else {
						// 点击取消跳转到主页面
						uni.switchTab({
							url: '/pages/index/index'
						})
					}
				}
			})
			return false
		}
		return true
	}

	// 跳转到登录页面
	const goToLogin = () => {
		sheep.$router.go('/subPackages/login/login')
	}

	// 处理用户名点击事件（未登录时跳转到登录页面）
	const handleLoginClick = () => {
		if (!isLogin.value) {
			goToLogin()
		}
	}

	// 处理头像点击事件
	const handleAvatarClick = () => {
		if (!checkLoginStatus()) return
		// 跳转到完善信息页面
		sheep.$router.go('/pages/user/info')
	}

	import arrow from '@/static/my/arrow.png'
	import icon1 from '@/static/my/icon1.png'
	import icon2 from '@/static/my/icon2.png'
	import icon3 from '@/static/my/icon3.png'
	import icon4 from '@/static/my/icon4.png'
	import icon5 from '@/static/my/icon5.png'
	import icon6 from '@/static/my/icon6.png'
	import icon7 from '@/static/my/icon7.png'
	const state = reactive({
		navHeight: 0,
		statusBarHeight: 0,
		avatart: 'https://wemayshiguang.oss-cn-shanghai.aliyuncs.com/avatart.png',
		registeVip: 'https://wemayshiguang.oss-cn-shanghai.aliyuncs.com/registeVip.png',
		preferentialVip: 'https://wemayshiguang.oss-cn-shanghai.aliyuncs.com/preferentialVip.png',
		gongfuVip: 'https://wemayshiguang.oss-cn-shanghai.aliyuncs.com/gongfuMember.png',
		openEyes: 'https://wemayshiguang.oss-cn-shanghai.aliyuncs.com/openEyes.png',
		eyesClosed: 'https://wemayshiguang.oss-cn-shanghai.aliyuncs.com/eyesClosed.png',
		customerService: 'https://wemayshiguang.oss-cn-shanghai.aliyuncs.com/customerService.png',
		userInfoImg: 'https://wemayshiguang.oss-cn-shanghai.aliyuncs.com/userInfo.png',
		refreshImg: 'https://wemayshiguang.oss-cn-shanghai.aliyuncs.com/refresh.png',
		myarrow: 'https://wemayshiguang.oss-cn-shanghai.aliyuncs.com/myarrow.png',
		isOpenEyes: false,
		vipLevel: '',
		invitationCode: '',
		arrow,
		current: -1,
		showPopupDialog: false,
		steps: [

		],
		listInfo: [{
				icon: icon1,
				title: '我的粉丝',
				path: '/subPackages/myFans/myFans'
			},
			{
				icon: icon2,
				title: '分享好友',
				path: `/subPackages/promotionPoster/promotionPoster`
			},
			{
				icon: icon3,
				title: '地址管理',
				path: '/pages/user/address/list'
			},
			{
				icon: icon4,
				title: '完善信息',
				path: '/pages/user/info'
			},
			// {
			// 	icon: icon5,
			// 	title: '优惠券',
			// 	path: '/pages/coupon/list'
			// },
			{
				icon: icon6,
				title: '关于售后',
				path: '/pages/public/faq'
			},
			{
				icon: icon7,
				title: '设置',
				path: '/pages/public/setting'
			}
		],
		showPopup: false,
		walletBalanceFlag: true,
		weidouAccount: true,
		consumptionBalanceFlag: true,
		showPlatformManager: false, // 平台管家弹框显示状态
		listQuery: {
			walletBalance: '',
			weidouNum: '',
			consumptionBalance: ''
		},
		profitList: [{
				img: 'https://wemayshiguang.oss-cn-shanghai.aliyuncs.com/profit1.png',
				text: '收益明细',
				path: `/subPackages/walletDetails/walletDetails`
			},
			{
				img: 'https://wemayshiguang.oss-cn-shanghai.aliyuncs.com/profit2.png',
				text: '订单管理',
				path: '/subPackages/order/list'
			},
			{
				img: 'https://wemayshiguang.oss-cn-shanghai.aliyuncs.com/profit4.png',
				text: '我的粉丝',
				path: '/subPackages/myFans/myFans'
			},
			{
				img: 'https://wemayshiguang.oss-cn-shanghai.aliyuncs.com/profit3.png',
				text: '激活中心',
				path: '/subPackages/activationPage/activationPage'
			}
		],
		userInfo: {},
		incomeStats: {},
		baseUrl: 'https://wei.wemay888.com',
		model: {},
		count:''
	})
	const userInfo = computed(() => sheep.$store('user').userInfo);
	const template = computed(() => sheep.$store('app').template.user);
	
	// 过滤常用功能列表，共富会员不显示"我的粉丝"
	const filteredListInfo = computed(() => {
		if (isLogin.value && state.vipLevel == 2) {
			return state.listInfo.filter(item => item.title !== '我的粉丝');
		}
		return state.listInfo;
	});
	onShow(async () => {
		// 未登录时直接提示登录
		if (!isLogin.value) {
			uni.showModal({
				title: '温馨提示',
				content: '登录个人中心请先登录',
				confirmText: '去登录',
				cancelText: '取消',
				success: (res) => {
					if (res.confirm) {
						uni.navigateTo({
							url: '/subPackages/login/login'
						})
					} else {
						// 点击取消跳转到主页面
						uni.switchTab({
							url: '/pages/index/index'
						})
					}
				}
			})
			return
		}
		
		try {
			// 立即执行未读消息数量获取
			await unreadMessageCount()
			// 确保获取最新用户信息
			await getUserInfo()
			await init()
		} catch (error) {
			console.error('页面显示时出错:', error)
			// 确保页面能够正常显示，即使出错也要设置默认状态
			state.userInfo = {}
			state.invitationCode = ''
			state.vipLevel = ''
		}
	});

	// 页面隐藏时的处理
	onHide(() => {
		// 页面隐藏时可以做一些清理工作
		console.log('用户页面隐藏')
	});
	const unreadMessageCount=async ()=>{
		try{
			const { code, data, msg } = await sheep.$api.user.unreadMessageCount()
			if(code==1){
				state.count=data.count
			}
		}catch(err){
			
		}
	}
	onLoad(async () => {
		getBarHeight()
		uni.showTabBar({
			fail: () => {},
		});
		
		// 页面加载时获取用户信息，以便在未登录时也能知道会员等级
		await getUserInfo()
	})
	const getUserInfo = async () => {
		try {
			const userInfo = await sheep.$store('user').getInfo();
			if (userInfo && Object.keys(userInfo).length > 0) {
				state.userInfo = userInfo
				state.invitationCode = state.userInfo.invite_code || ''
				state.vipLevel = state.userInfo.level || ''

				// 处理头像URL
				if (state.userInfo.avatar && !state.userInfo.avatar.startsWith('https://')) {
					state.userInfo.avatar = `${state.baseUrl}${state.userInfo.avatar}`
				}

				state.userInfo.directs = state.userInfo.directs == null ? 0 : state.userInfo.directs
			} else {
				// 未登录或获取用户信息失败时的默认状态
				state.userInfo = {}
				state.invitationCode = ''
				state.vipLevel = ''
			}
		} catch (error) {
			console.error('获取用户信息失败:', error)
			// 出错时的默认状态
			state.userInfo = {}
			state.invitationCode = ''
			state.vipLevel = ''
		}
		state.steps = []

		console.log(state.current, '参数哈哈哈哈')
		if (state.vipLevel == 0) {
			for (let i = 0; i <= 5; i++) {
				state.steps.push({
					label: `${i+1}件`
				})
			}
			state.current = state.userInfo.repurchase_count == 0 ? -1 : state.userInfo.repurchase_count - 1
		}
		if (state.vipLevel == 1) {
			for (let i = 0; i <= 5; i++) {
				state.steps.push({
					label: `${i+1}位`
				})
			}
		}
		if (state.vipLevel == 2) {
			await getWealthInfoList() //工富信息
		}
	};
	const getWealthInfoList = async () => {
		try {
			const { code, data } = await sheep.$api.user.getWealthInfo()
			if (code == 1) {
				state.incomeStats = data.income_stats
			}
		} catch (err) {

		}
	}
	const init = async () => {
		try {
			await sheep.$store('user').updateUserData();
		} catch (error) {
			console.error('更新用户数据失败:', error)
		} finally {
			setTimeout(function() {
				uni.stopPullDownRefresh();
			}, 800);
		}
	}

	// 手动刷新用户信息
	const handleRefresh = async () => {
		try {
			uni.showLoading({
				title: '刷新中...'
			})
			await getUserInfo()
			await init()
			uni.showToast({
				title: '刷新成功',
				icon: 'success',
				duration: 1500
			})
		} catch (error) {
			console.error('手动刷新时出错:', error)
			uni.showToast({
				title: '刷新失败',
				icon: 'none',
				duration: 1500
			})
		} finally {
			uni.hideLoading()
		}
	}

	const handleCustomerService = () => {
		// 显示平台管家弹框
		state.showPlatformManager = true
	}

	// 处理平台管家弹框关闭
	const handleClosePopup = () => {
		state.showPlatformManager = false
	}

	// 处理弹框关闭
	const handleClose = () => {
		// 优先使用子组件的关闭方法
		if (popupDialogRef.value && typeof popupDialogRef.value.closeDialog === 'function') {
			popupDialogRef.value.closeDialog()
		} else {
			// 回退到原来的方式
			state.showPopupDialog = false
		}
	}

	// 处理弹框确认
	const handlePopupConfirm = () => {
		// 优先使用子组件的关闭方法
		if (popupDialogRef.value && typeof popupDialogRef.value.closeDialog === 'function') {
			popupDialogRef.value.closeDialog()
		} else {
			// 回退到原来的方式
			state.showPopupDialog = false
		}
		uni.showToast({
			title: '已确认',
			icon: 'success'
		})
	}

	// 直接显示客服弹框，不需要登录检查
	const handleCustomerServiceDirect = () => {
		state.showPlatformManager = true
	}
	// 微豆
	const handleMicroBeans = () => {
		sheep.$router.go('/subPackages/tinyBeans/tinyBeans')
	}
	// 复制
	const handleCopy = () => {
		uni.setClipboardData({
			data: state.invitationCode,
			success: () => {
				uni.showToast({
					title: '复制成功',
					icon: 'none'
				});
			},
			fail: (err) => {
				uni.showToast({
					title: '复制失败',
					icon: 'none'
				});
				console.error(err);
			}
		});
	}
	// 睁眼闭眼
	const handleOpenEyes = () => {
		state.isOpenEyes = !state.isOpenEyes
	}
	const handleInfo = () => {
		sheep.$router.go('/subPackages/messageInfo/messageInfo')
	}
	const handleClick = (path) => {
		console.log('准备跳转到:', path)
		try {
			sheep.$router.go(path)
		} catch (error) {
			console.error('跳转失败:', error)
			uni.showToast({
				title: '页面跳转失败',
				icon: 'none'
			})
		}
	}

	// 带登录检查的函数
	const handleCopyWithLogin = () => {
		if (!checkLoginStatus()) return
		handleCopy()
	}

	const handleOpenEyesWithLogin = () => {
		if (!checkLoginStatus()) return
		handleOpenEyes()
	}


	const handleInfoWithLogin = () => {
		if (!checkLoginStatus()) return
		handleInfo()
	}

	const handleMicroBeansWithLogin = () => {
		if (!checkLoginStatus()) return
		handleMicroBeans()
	}

	const goMywalletWithLogin = () => {
		if (!checkLoginStatus()) return
		goMywallet()
	}

	const handleConsumptionGoldWithLogin = () => {
		if (!checkLoginStatus()) return
		handleConsumptionGold()
	}

	const handleDetailsWithLogin = (url) => {
		if (!checkLoginStatus()) return
		handleDetails(url)
	}

	// 处理说明点击事件
	const handleDescribeWithLogin = (vipLevel) => {
		if (!checkLoginStatus()) return
		// 跳转到激活中心页面，该页面包含会员等级说明
		sheep.$router.go('/subPackages/activationPage/activationPage')
	}

	const handleClickWithLogin = (path) => {
		console.log('handleClickWithLogin 被调用，路径:', path)
		if (!checkLoginStatus()) return
		handleClick(path)
	}

	// 处理功能项点击，未登录时直接提示登录
	const handleItemClick = (item) => {
		console.log('点击功能项:', item.title, '路径:', item.path)
		
		// 未登录时直接提示登录
		if (!checkLoginStatus()) return
		
		// 已登录则直接跳转
		handleClick(item.path)
	}


	// 眼睛图标点击 - 需要登录检查
	const handlewWalletBalanceFlagWithLogin = () => {
		if (!checkLoginStatus()) return
		handlewWalletBalanceFlag()
	}

	const handleWeidouAccountWithLogin = () => {
		if (!checkLoginStatus()) return
		handleWeidouAccount()
	}

	const handleConsumptionBalanceFlagWithLogin = () => {
		if (!checkLoginStatus()) return
		handleConsumptionBalanceFlag()
	}
	// 去消费金
	const handleConsumptionGold = () => {
		sheep.$router.go('/subPackages/consumptionGold/consumptionGold')
	}
	const getBarHeight = () => {
		let {
			statusBarHeight,
			system
		} = uni.getSystemInfoSync()
		// 注意返回的单位是px 不是rpx
		console.log('状态栏高度是', statusBarHeight + 'px', '设备型号是', system);
		state.statusBarHeight = statusBarHeight
		// 而导航栏的高度则 = 状态栏的高度 + 判断机型的值（是ios就+40，否则+44）
		// 这个高度刚好和胶囊对齐
		state.navHeight = statusBarHeight + (system.indexOf('iOS') > -1 ? 40 : 44)
		console.log(state.navHeight, "导航栏高度");
	}
	onPullDownRefresh(async () => {
		try {
			// 刷新时重新获取最新用户信息
			await getUserInfo();
			await sheep.$store('user').updateUserData();
		} catch (error) {
			console.error('下拉刷新时出错:', error);
		} finally {
			setTimeout(function() {
				uni.stopPullDownRefresh();
			}, 800);
		}
	});

	const handlewWalletBalanceFlag = () => {
		state.walletBalanceFlag = !state.walletBalanceFlag
	}
	const handleWeidouAccount = () => {
		state.weidouAccount = !state.weidouAccount
	}

	const handleConsumptionBalanceFlag = () => {
		state.consumptionBalanceFlag = !state.consumptionBalanceFlag
	}
	// 我的钱包
	const goMywallet = () => {
		sheep.$router.go('/subPackages/myWallet/myWallet')
		// sheep.$router.go('/pages/pay/withdraw')
	}
	// 工富会员跳转
	const handleDetails = (url) => {
		sheep.$router.go(url)
	}

	// 点击调用子组件方法
	const handleCallOrderCardMethod = () => {
		if (orderCardRef.value) {
			// 假设子组件有 refresh 方法
			if (typeof orderCardRef.value.refresh === 'function') {
				orderCardRef.value.refresh();
				uni.showToast({
					title: '订单卡片已刷新',
					icon: 'success'
				});
			} else {
				uni.showToast({
					title: '订单卡片组件不支持此方法',
					icon: 'none'
				});
			}
		} else {
			uni.showToast({
				title: '订单卡片组件未找到',
				icon: 'none'
			});
		}
	}

	const handleCallStepsMethod = () => {
		if (stepsRef.value) {
			// 假设子组件有 nextStep 方法
			if (typeof stepsRef.value.nextStep === 'function') {
				stepsRef.value.nextStep();
				uni.showToast({
					title: '步骤已更新',
					icon: 'success'
				});
			} else {
				uni.showToast({
					title: '步骤组件不支持此方法',
					icon: 'none'
				});
			}
		} else {
			uni.showToast({
				title: '步骤组件未找到',
				icon: 'none'
			});
		}
	}

	const handleCallPopupMethod = () => {
		// 优先显示平台管家弹框
		state.showPlatformManager = true
		uni.showToast({
			title: '平台管家弹窗已显示',
			icon: 'success'
		});
	}

	onPageScroll(() => {});
</script>

<style lang="scss" scoped>

	.user-wrap {
		position: fixed;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		background: #F8F7F7;
		overflow-y: auto;
		overflow-x: hidden;
		-webkit-overflow-scrolling: touch;
	}


	.bottom-safe-area {
		height: 40rpx;
		background: transparent;
	}

	.vip-img {
		width: 142rpx;
		height: 36rpx !important;
		display: block;
		flex-shrink: 0;
	}

	// 未登录提示样式
	.login-notice {
		margin: 20rpx;
		padding: 24rpx;
		background: linear-gradient(135deg, #fff7ed 0%, #fef3c7 100%);
		border-radius: 16rpx;
		border: 2rpx solid #fed7aa;
		box-shadow: 0 4rpx 12rpx rgba(255, 107, 53, 0.1);

		.notice-content {
			display: flex;
			align-items: center;
			justify-content: space-between;
			gap: 16rpx;

			.notice-icon {
				font-size: 32rpx;
				min-width: 40rpx;
			}

			.notice-text {
				flex: 1;
				font-size: 26rpx;
				color: #ea580c;
				line-height: 1.4;
				font-weight: 500;
			}

			.notice-btn {
				padding: 12rpx 24rpx;
				background: linear-gradient(135deg, #FF7C00 0%, #FF9500 100%);
				border-radius: 20rpx;
				font-size: 24rpx;
				color: white;
				font-weight: 600;
				white-space: nowrap;

				&:active {
					transform: scale(0.95);
				}
			}
		}
	}

	// 登录按钮样式
	.login-btn {
		margin-left: 20rpx;
		padding: 12rpx 24rpx;
		background: linear-gradient(135deg, #FF7C00 0%, #FF9500 100%);
		border-radius: 25rpx;
		font-size: 24rpx;
		color: white;
		font-weight: 500;

		&:active {
			transform: scale(0.95);
		}
	}

	.main-bg {
		height: 300rpx;
		background: url('https://wemayshiguang.oss-cn-shanghai.aliyuncs.com/bg.png') no-repeat 0 0;
		background-size: cover;
	}

	.main-info {
		padding: 80rpx 30rpx 0;
		display: flex;
		justify-content: space-between;
		width: 100%;
		box-sizing: border-box;
	}

	.main-user {
		display: flex;
		align-items: center;
		flex: 1;
		min-width: 0;
	}

	.avatar-box {
		cursor: pointer;
		transition: transform 0.2s ease;
		
		&:active {
			transform: scale(0.95);
		}
	}

	.tui-avatar {
		width: 128rpx;
		height: 128rpx;
		border-radius: 50%;
		display: block;
		transition: opacity 0.2s ease;
	}

	.user-flex {
		display: flex;
		align-items: center;
		width: 100%;
	}

	.income-wrap {
		background: #FFFFFF;
		border-radius: 10rpx;
		margin: 20rpx;


		.income-tips {
			width: 578rpx;
			height: 50rpx;
			background: #FFF1E5;
			border-radius: 0rpx 0rpx 20rpx 20rpx;
			margin: 0 auto 20rpx;
			text-align: center;
			font-family: PingFang SC;
			font-weight: 500;
			font-size: 22rpx;
			color: #FF7C00;
			line-height: 50rpx;
		}

		.income-list {
			padding: 0 30rpx;
			display: flex;

			.income-item {
				display: flex;
				align-items: center;
				flex-direction: column;
				padding-bottom: 20rpx;
				border-bottom: 1rpx #eee solid;
				width: 100%;

				.income-title {
					font-family: PingFang SC;
					font-weight: 400;
					font-size: 24rpx;
					color: #333333;
					line-height: 48rpx;
				}

				.income-num {
					font-family: DIN;
					font-weight: 500;
					font-size: 32rpx;
					color: #333333;
					line-height: 48rpx;
				}

			}
		}

		.flex-list {
			display: flex;
			padding: 20rpx 30rpx;

			.flex-item {
				width: 25%;
				display: flex;
				align-items: center;
				justify-content: center;
				flex-direction: column;
			}

			.flex-item-img {
				width: 56rpx;
				height: 56rpx;
				margin-bottom: 20rpx;
				display: block;
			}

			.text-info {
				font-family: PingFang SC;
				font-weight: 400;
				font-size: 24rpx;
				color: #9D6534;
				line-height: 23rpx;
			}

		}
	}

	.card-list-wrap {
		display: flex;
		justify-content: space-between;
		padding: 0 20rpx;

		.card-item {
			flex: 1;
			display: flex;
			flex-direction: column;
			background: #fff;
			margin-right: 20rpx;
			padding: 30rpx;
			border-radius: 10rpx;

			&:last-child {
				margin-right: 0;
			}

			.eyes-box {
				padding-bottom: 30rpx;
				display: flex;
				justify-content: flex-end;
			}

			.money-box {
				font-family: PingFang SC;
				font-weight: 600;
				font-size: 28rpx;
				color: #333333;
				text-align: center;
			}

			.tips-box {
				font-family: PingFang SC;
				font-weight: 400;
				font-size: 24rpx;
				color: #333333;
				padding: 20rpx 0;
				text-align: center;
			}

			.card-btn {
				text-align: center;
				width: 108rpx;
				height: 34rpx;
				line-height: 34rpx;
				background: #FFF1E5;
				background: #FFF1E5;
				border-radius: 5rpx;
				font-family: PingFang SC;
				font-weight: 400;
				font-size: 22rpx;
				color: #FF7C00;
				margin: 0 auto;
			}
		}
	}

	.avatar-info {
		margin-left: 10rpx;
		display: flex;
		flex-direction: column;
		flex: 1;
		min-width: 0;
	}

	.user-name {
		font-weight: 500;
		font-size: 30rpx;
		color: #333333;
		margin-top: 4rpx;
		margin-right: 10rpx;
		min-width: 0;
		white-space: nowrap;
		overflow: hidden;
		text-overflow: ellipsis;

		&:active {
			transform: scale(0.98);
		}
	}

	// 未登录时的"请登录"样式
	.user-name[data-logged-in="false"] {
		color: #FF7C00;
		font-weight: 600;
		cursor: pointer;
	}

	.invitation-code {
		display: flex;
		margin-top: 20rpx;
		font-family: PingFang SC;
		font-weight: 400;
		font-size: 26rpx;
		color: #333333;


		.copy-box {
			margin: 0 10rpx;
		}
	}

	.eys-box {
		width: 26rpx;
	}

	.main-right {
		display: flex;
		align-items: center;

	}

	.img-info {
		width: 60rpx;
		height: 60rpx !important;
	}

	.userInfo-box {
		position: relative;
	}

	.unread-badge {
		position: absolute;
		top: -8rpx;
		right: -8rpx;
		min-width: 32rpx;
		height: 26rpx;
		border-radius: 13rpx;
		background: #FF7C00;
		border: none;
		box-shadow: none;
		display: flex;
		align-items: center;
		justify-content: center;
		font-size: 20rpx;
		color: #fefefe;
		font-weight: 500;
		padding: 0 8rpx;
		box-sizing: border-box;
		z-index: 10;
	}

	.refresh-box {
		margin-right: -30rpx;
	}

	.customerService-box {
		margin-right: 20rpx;
	}

	.arrowRight-img {
		width: 24rpx;
		margin-left: 20rpx;
	}

	.my-tiny-beans {
		padding: 30rpx;
		background: #fff;
		border-radius: 5rpx;
		margin: 20rpx;
		display: flex;
		justify-content: space-between;
		align-items: center;
	}

	.my-name {
		font-family: PingFang SC;
		font-weight: 500;
		font-size: 28rpx;
		color: #333333;
	}

	.num-box {
		display: flex;
		align-items: center;
		font-family: PingFang SC;
		font-weight: 600;
		font-size: 32rpx;
		color: #333333;
	}

	.my-order {
		background: #fff;
		border-radius: 5rpx;
		margin: 0 20rpx;
	}

	.card-list {
		padding: 0 20rpx;
	}

	.card-wrap {
		min-height: 300rpx;
		background-size: cover;
		display: block;
		position: relative;
	}
	
	.register-bg {
		background: url('https://wemayshiguang.oss-cn-shanghai.aliyuncs.com/registerBg.png') no-repeat 0 0;
		background-size:cover;
	}
	
	.preferential-bg {
		background: url('https://wemayshiguang.oss-cn-shanghai.aliyuncs.com/mybg.png') no-repeat 0 0;
		background-size:cover;
	}

	.card-title {
		display: flex;
		align-items: center;
		font-family: PingFang;
		font-weight: 500;
		font-size: 24rpx;
		color: #999999;
		position: absolute;
		right: 20rpx;
		top: 40rpx;

		.arrow-img-info {
			width: 15rpx;
			margin-left: 10rpx;
			display: block;

		}
	}

	.introduction-wrap {
		padding: 100rpx 30rpx 0;
	}

	.introduction-title {
		font-family: PingFang;
		font-weight: 500;
		font-size: 30rpx;
		color: #333333;
		line-height: 48rpx;
	}

	.orgin-color {
		color: #FF7C00;
	}

	.item-info {
		font-family: PingFang;
		font-weight: 500;
		font-size: 26rpx;
		color: #797D93;
		line-height: 48rpx;
	}

	.step-wrap {
		padding: 10rpx 0;
	}

	.step-tips {
		font-family: PingFang SC;
		font-weight: 400;
		font-size: 26rpx;
		color: #333333;
		text-align: center;
		line-height: 48rpx;
		padding-bottom: 20rpx;

	}

	.common-functions {
		background: #FFFFFF;
		border-radius: 10rpx;
		margin: 20rpx;
	}



	.title-wrap {
		font-family: PingFang;
		font-weight: bold;
		font-size: 28rpx;
		color: #333333;
		line-height: 48rpx;
		padding: 20rpx 30rpx 40rpx;
	}

	.list-wrap {
		display: flex;
		width: 100%;
		flex-wrap: wrap;
	}

	.list-item {
		width: 25%;
		display: flex;
		align-items: center;
		justify-content: center;
		flex-direction: column;
		margin-bottom: 50rpx;

	}

	.icon-img {
		width: 40rpx;
		height: 40rpx !important;
		display: block;
		margin-bottom: 20rpx;
	}

	.list-text {
		font-family: PingFang SC;
		font-weight: 400;
		font-size: 24rpx;
		color: #323233;

	}

	// 测试按钮区域样式
	.test-buttons {
		background: #FFFFFF;
		border-radius: 10rpx;
		margin: 20rpx;
		padding: 20rpx 0;

		.test-title {
			font-family: PingFang SC;
			font-weight: 500;
			font-size: 26rpx;
			color: #666666;
			text-align: center;
			margin-bottom: 20rpx;
		}

		.test-buttons-wrap {
			display: flex;
			justify-content: space-around;
			flex-wrap: wrap;
			gap: 15rpx;
			padding: 0 20rpx;

			.test-btn {
				min-width: 200rpx;
				padding: 20rpx 30rpx;
				background: linear-gradient(135deg, #FF7C00 0%, #FF9500 100%);
				border-radius: 25rpx;
				display: flex;
				align-items: center;
				justify-content: center;
				transition: all 0.3s ease;

				&:active {
					transform: scale(0.95);
					opacity: 0.8;
				}

				text {
					font-family: PingFang SC;
					font-weight: 500;
					font-size: 24rpx;
					color: #FFFFFF;
				}
			}
		}
	}

	// 自定义弹框样式
	.custom-popup-overlay {
		position: fixed;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		background: rgba(0, 0, 0, 0.6);
		z-index: 9999;
		display: flex;
		align-items: center;
		justify-content: center;
		animation: fadeIn 0.3s ease;
	}
	
	.custom-popup-content {
		width: 700rpx;
		position: absolute;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		background: url('https://wemayshiguang.oss-cn-shanghai.aliyuncs.com/qrCodeBg.png') no-repeat center center;
		background-size: contain;
		z-index: 1;
		border-radius: 24rpx;
		position: relative;
		overflow: hidden;
		display: flex;
		flex-direction: column;
		align-items: center;
		padding: 0;
		box-sizing: border-box;
		animation: slideIn 0.3s ease;
	}
	
	.dialog-bg-image {}
	
	.close-btn {
		position: absolute;
		top: 20rpx;
		right: 20rpx;
		width: 60rpx;
		height: 60rpx;
		background: rgba(255, 255, 255, 0.9);
		border-radius: 50%;
		display: flex;
		align-items: center;
		justify-content: center;
		z-index: 10;
		backdrop-filter: blur(10rpx);
		box-shadow: 0 4rpx 12rpx rgba(0, 0, 0, 0.1);
		transition: all 0.3s ease;
	}
	
	.close-btn:active {
		transform: scale(0.9);
		background: rgba(255, 255, 255, 1);
	}
	
	.close-icon {
		font-size: 40rpx;
		color: #666666;
		font-weight: 300;
		line-height: 1;
	}
	
	@keyframes fadeIn {
		from {
			opacity: 0;
		}
	
		to {
			opacity: 1;
		}
	}
	
	@keyframes slideIn {
		from {
			transform: scale(0.8);
			opacity: 0;
		}
	
		to {
			transform: scale(1);
			opacity: 1;
		}
	}
	
	.dialog-title {
		position: relative;
		z-index: 2;
		font-family: PingFang SC, PingFang SC;
		font-weight: 600;
		font-size: 30rpx;
		color: #333333;
		margin-top: 170rpx;
		text-align: center;
		text-shadow: 0 2rpx 8rpx rgba(0, 0, 0, 0.15);
		letter-spacing: 2rpx;
	}
	
	.qr-code-section {
		position: relative;
		z-index: 2;
		text-align: center;
		margin-bottom: 20rpx;
	}
	
	.qr-code-wrapper {
	
		border-radius: 20rpx;
		padding: 20rpx;
	
		display: inline-block;
		backdrop-filter: blur(10rpx);
	}
	
	.qr-code-img {
		width: 360rpx;
		height: 360rpx;
		display: block;
		border-radius: 12rpx;
	}
	
	.instruction-text {
		position: relative;
		z-index: 2;
		display: flex;
		flex-direction: column;
		align-items: center;
		gap: 16rpx;
		margin-bottom: 40rpx;
	}
	
	.scan-text {
		font-family: PingFang SC, PingFang SC;
		font-weight: 400;
		font-size: 28rpx;
		color: #333333;
		text-align: center;
		text-shadow: 0 2rpx 6rpx rgba(0, 0, 0, 0.15);
		letter-spacing: 1rpx;
	}
	
	.add-text {
		font-family: PingFang SC, PingFang SC;
		font-family: PingFang SC, PingFang SC;
		font-weight: 400;
		font-size: 24rpx;
		color: #666666;
		text-shadow: 0 1rpx 3rpx rgba(0, 0, 0, 0.1);
	}
	
	.confirm-button {
		position: relative;
		z-index: 2;
		width: 540rpx;
		height: 100rpx;
		background: linear-gradient(135deg, #FF7C00 0%, #FF9500 100%);
		border-radius: 10rpx;
		display: flex;
		align-items: center;
		justify-content: center;
		border: none;
		transition: all 0.3s ease;
		margin-bottom: 80rpx;
		box-shadow: 0 16rpx 40rpx rgba(255, 124, 0, 0.4);
		backdrop-filter: blur(10rpx);
	}
	
	.confirm-button:active {
		transform: scale(0.95);
		background: linear-gradient(135deg, #e67000 0%, #e68500 100%);
		box-shadow: 0 8rpx 20rpx rgba(255, 124, 0, 0.4);
	}
	
	.btn-text {
		font-family: PingFang SC, PingFang SC;
		font-weight: 600;
		font-size: 28rpx;
		color: #FFFFFF;
		text-shadow: 0 2rpx 4rpx rgba(0, 0, 0, 0.2);
		letter-spacing: 2rpx;
	}
	
	.user-wrap {
		min-height: 100vh;
		background: #F8F8F8;
	}
	
	.vip-img {
		width: 142rpx;
		height: 36rpx !important;
		display: block;
	}
	
	.main-bg {
		height: 300rpx;
		background: url('https://wemayshiguang.oss-cn-shanghai.aliyuncs.com/bg.png') no-repeat 0 0;
		background-size: cover;
	}
	
	.main-info {
		padding: 80rpx 30rpx 0;
		display: flex;
		justify-content: space-between;
	}
	
	.main-user {
		display: flex;
		align-items: center;
	
	}
	
	.tui-avatar {
		width: 128rpx;
		height: 128rpx;
		border-radius: 50%;
		display: block;
	}
	
	.user-flex {
		display: flex;
		align-items: center;
	}
	

</style>